<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>提升顾客购物体验的关键点(全选以及反选)</title>
</head>
<body>
<input class="btn" type="checkbox" id="all">提升顾客购物体验
<ul>
    <li><input type="checkbox" name="pro">商品的批量操作</li>
    <li><input type="checkbox" name="pro">直观的用户界面</li>
    <li><input type="checkbox" name="pro">流畅的用户体验</li>
    <li><input type="checkbox" name="pro">清晰的展示商品</li>
    <li><input type="checkbox" name="pro">及时的客服回复</li>
</ul>
<script>
    let all = document.getElementById('all');
    all.onchange = function () {
        let pro = document.getElementsByName('pro');
        for (let i = 0; i < pro.length; i++) {
            pro[i].checked = all.checked;
        }
    }
</script>
</body>
</html>